<%--
  Created by IntelliJ IDEA.
  User: acer
  Date: 2019/1/17
  Time: 18:13
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <meta charset="utf-8">
    <title>评分页面</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../layuiadmin/layui/css/layui.css" media="all">
    <!-- 注意：如果你直接复制所有代码到本地，上述css路径需要改成你本地的 -->
    <style>
        body {
            margin: 10px;
        }
        .demo-carousel {
            height: 200px;
            line-height: 200px;
            text-align: center;
        }
    </style>
    <script src="../../js/jquery.min.3.1.0.js"></script>
</head>
<body>
<div style="margin-bottom: 5px;">
    <ins class="adsbygoogle" style="display:inline-block;width:970px;height:50px"
         data-ad-client="ca-pub-6111334333458862" data-ad-slot="3820120620"></ins>
</div>
<style type="text/css">
    .layui-form-item {
        margin-left: 250px;
        margin-top: -38px;
        width: 600px;
    }
    .layui-form-checkbox[lay-skin=primary] i {
        position: relative;
        top: 6px;
    }
    .layui-input, .layui-textarea {
        width: 129%;
    }
</style>

<div class="demoTable">
    <form id="myform" action="" method="post" class="layui-form">
        <div class="layui-inline">
            <input class="layui-input" name="name" id="name" placeholder="请输入用户账号或商品名称搜索" autocomplete="off">
        </div>

    </form>

    <div class="layui-form-item">
        <button class="layui-btn" data-type="reload">搜索</button>
        <button class="layui-btn" data-type="isAdd">新增评价</button>
        <button class="layui-btn" data-type="isDelAll">批量删除</button>
        <button class="layui-btn" data-type="isExport">导出数据</button>
        <button class="layui-btn" data-type="isImport">导入数据</button>
    </div>
</div>

<table class="layui-table" lay-data="{height:500, url:'/EvaluateServlet', page:true, id:'idTest'}"
       lay-filter="demo">
    <thead>
    <tr>
        <th lay-data="{type:'checkbox', fixed: 'left'}"></th>
        <th lay-data="{type:'numbers', width:50, fixed: 'left'}">序号</th>
        <th lay-data="{field:'consumerAccount', width:120, align:'center'}" >用户账号</th>
        <th lay-data="{field:'wareName', width:120, align:'center'}">商品名称</th>
        <th lay-data="{field:'evaluateScore', width:120, align:'center'}">评分等级</th>
        <th lay-data="{field:'evaluatePhoto', width:200, align:'center'}">用户评价图片</th>
        <th lay-data="{field:'evaluateDescribe', maxwidth:500, align:'center'}">用户描述</th>
        <th lay-data="{fixed: 'right', width:120, align:'center', toolbar: '#barDemo'}">操作</th>
    </tr>
    </thead>
</table>

<script type="text/html" id="barDemo">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
</script>


<script src="../../layuiadmin/layui/layui.js" charset="utf-8"></script>
<!-- 注意：如果你直接复制所有代码到本地，上述js路径需要改成你本地的 -->
<script>

    layui.use('table', function () {
        var table = layui.table;
        //监听表格复选框选择
        table.on('checkbox(demo)', function (obj) {
            console.log(obj)
        });
        //监听单元格编辑
        table.on('edit(test)', function (obj) {
            var value = obj.value //得到修改后的值
                , data = obj.data //得到所在行所有键值
                , field = obj.field; //得到字段
            layer.msg('[ID: ' + data.noticeId + '] ' + field + ' 字段更改为：' + value);
        });
        //监听工具条
        table.on('tool(demo)', function (obj) {
            var data = obj.data;
            if (obj.event === 'del') {
                layer.confirm('真的删除行么', function (index) {
                   $.ajax({
                        url: "/DeleteEvaluateServlet",
                        type: "get",
                        data: {id:data.evaluateId},
                        success: function (data) {
                            var da = data;
                            alert(da.msg);
                            location.reload();
                        }
                    });
                });
            } else if (obj.event === 'edit') {
                parent.layer.open({
                    title: '修改',
                    maxmin: true,
                    type: 2,
                    content: '/UpdateEvaluateEchoServlet?id=' + data.evaluateId,
                    area: ['800px', '600px'],
                    end: function () {
                        location.reload();
                    }
                })
            }
        });

        var $ = layui.$, active = {
            getCheckData: function () { //获取选中数据
                var checkStatus = table.checkStatus('idTest')
                    , data = checkStatus.data;
                layer.alert(JSON.stringify(data));
            }
            , getCheckLength: function () { //获取选中数目
                var checkStatus = table.checkStatus('idTest')
                    , data = checkStatus.data;
                layer.msg('选中了：' + data.length + ' 个');
            }
            , isAll: function () { //验证是否全选
                var checkStatus = table.checkStatus('idTest');
                layer.msg(checkStatus.isAll ? '全选' : '未全选')
            }
            , isAdd: function () {
                layer.open({
                    type: 2
                    , title: '新增评分'
                    , maxmin: true
                    , area: ['800px', '600px']
                    , content: 'InsePageEvaluate.jsp'
                    , end: function () {
                        location.reload();
                    }
                });
            }
            , isDelAll: function () {
                //获取选中数据
                var checkStatus = table.checkStatus('idTest')
                    , data = checkStatus.data;
                var objs = eval(data);
                if (objs.length != null && "" != objs.length) {
                    layer.confirm('真的删除选中行么', function (index) {
                        var ids = "";
                        for (var j = 0; j < objs.length; j++) {
                            if (j == 0) {
                                ids += objs[0].evaluateId;
                            } else {
                                ids += "," + objs[j].evaluateId;
                            }
                        }
                        $.ajax({
                            url:"../../DeleteAllEvaluateServlet",    //请求的url地址
                            dataType:"json",   //返回格式为json
                            contentType:"application/json",
                            async:true,//请求是否异步，默认为异步，这也是ajax重要特性
                            data:{"ids":ids},  //参数值
                            type:"GET",   //请求方式
                            success:function(data){
                                //请求成功时处理
                                layer.alert(data.msg, function(index) {
                                    location.reload();
                                })
                            }
                        });
                    });
                } else {
                    layer.msg("未选中")
                }
            }

            , isExport: function () {
                //获取选中数据
                var checkStatus = table.checkStatus('idTest')
                    , data = checkStatus.data;
                var objs = eval(data);
                if (objs.length != null && "" != objs.length) {
                    layer.confirm('导出选中数据么', function (index) {
                        var ids = "";
                        for (var j = 0; j < objs.length; j++) {
                            if (j == 0) {
                                ids += objs[0].id;
                            } else {
                                ids += "," + objs[j].id;
                            }
                        }
                        layer.closeAll('dialog'); //关闭信息框
                        window.location.href = "/ExportOrderServlet?ids=" + ids;
                    });
                } else {
                    layer.msg("未选中")
                }
            }
            , isImport: function () {
                layer.open({
                    type: 2
                    , title: '导入数据'
                    , maxmin: true
                    , area: ['800px', '600px']
                    , content: 'customerImport.jsp'
                    , end: function () {
                        location.reload();
                    }
                });
            }
            , reload: function () {
                var name = $('#name');
                var na = name.val();
                //执行重载
                table.reload('idTest', {
                    page: {
                        curr: 1 //重新从第 1 页开始
                    }
                    , where: {
                        name: na,
                    }
                });
            }
        };

        $('.demoTable .layui-btn').on('click', function () {
            var type = $(this).data('type');
            active[type] ? active[type].call(this) : '';
        });


    });
</script>
</body>
</html>
